<template>
  <div class="container">
    <!-- 首页入口 -->
    <home-entry-vue></home-entry-vue>
  </div>
  <!-- 新鲜好物 -->
  <home-new-vue></home-new-vue>
  <!-- 人气爆款 -->
  <home-hot-vue></home-hot-vue>
  <!-- 热门品牌 -->
  <home-panel-vue></home-panel-vue>
</template>

<script setup>
import {} from 'vue'
import homeEntryVue from './compoents/home-entry.vue'
import homeNewVue from './compoents/home-new.vue'
import homeHotVue from './compoents/home-hot.vue'
import homePanelVue from './compoents/home-panel.vue'
</script>

<style lang="scss" scoped>
// 左侧分类
.home-category {
  width: 250px;
  height: 450px;
  background: rgba(0, 0, 0, 0.8);
  position: relative;
  z-index: 99;
  .menu {
    .menu-item {
      padding-left: 40px;
      height: 50px;
      line-height: 50px;
      &:hover {
        background: $xtxColor;
      }
      a {
        margin-right: 4px;
        color: #fff;
        &:first-child {
          font-size: 16px;
        }

        ~ a:hover {
          color: #333333;
        }
      }

      &:hover {
        .home-layer {
          display: block;
        }
      }
    }
  }
}

// 左侧分类弹出层样式

// banner 样式

// banner 样式结束

// 轮播图样式

// 轮播商品

// 轮播图样式结束

// 新鲜好物

// 热门品牌
</style>
